<template>
  <div>
    <el-dialog :title="title" :visible.sync="open" width="1100px" append-to-body @close="cancel">
      <el-form ref="form" :model="form" :rules="rules" label-width="90px" size="small">
        <el-form-item label="涨价名称" prop="projectName">
          <el-input v-model="form.projectName" placeholder="请输入涨价名称"/>
        </el-form-item>
        <el-form-item label="首要条件" prop="termFristAverageLoss">
          <el-input class="width4" v-model="form.termFristAverageLoss" placeholder="请输入">
            <template slot="prepend">平均亏损</template>
            <template slot="append">元以内的不执行涨价</template>
          </el-input>
        </el-form-item>
        <el-form-item label="涨价条件1" prop="termOneLossPrice">
          <el-input v-model="form.termOneLossPrice" class="mr10" style="width: 300px" placeholder="请输入">
            <template slot="prepend">单品亏损</template>
            <template slot="append">元以上</template>
          </el-input>
          <el-input v-model="form.termOneAdjustmentLossPrice" style="width: 300px" placeholder="请输入">
            <template slot="prepend">调整折扣后亏损</template>
            <template slot="append">元以内</template>
          </el-input>
        </el-form-item>
        <el-form-item label="涨价条件2" prop="termTwoOrderNumber">
          <el-input style="width: 300px" class="mr10" v-model="form.termTwoOrderNumber" placeholder="请输入">
            <template slot="prepend">亏损超过</template>
            <template slot="append">单及以上</template>
          </el-input>
          <el-input style="width: 300px" v-model="form.termTwoAdjustmentDiscount" placeholder="请输入">
            <template slot="prepend">上调折扣</template>
            <template slot="append">%</template>
          </el-input>
        </el-form-item>
        <el-form-item label="涨价条件3" prop="termThreeOrderNumber">
          <el-input v-model="form.termTwoOrderNumber" type="number" class="width3" placeholder="请输入">
            <template slot="prepend">亏损超过</template>
            <template slot="append">单及以上</template>
          </el-input>
          <el-input class="ml10 mr10 width3" v-model="form.termThreeOrderNumber" type="number"
                    placeholder="请输入">
            <template slot="prepend">每亏损</template>
            <template slot="append">单及以上</template>
          </el-input>
          <el-input class="width3" v-model="form.termThreeAdjustmentDiscount" type="number"
                    placeholder="请输入">
            <template slot="prepend">上调折扣</template>
            <template slot="append">%</template>
          </el-input>
        </el-form-item>
        <el-form-item label="涨价数量" prop="priceRiseNumber">
          <el-radio-group v-model="form.priceRiseType">
            <div class="flex">
              <el-radio label="0">百分比</el-radio>
              <el-input v-model="percentage" style="width: 400px" placeholder="请输入">
                <template slot="append">%以内（占总在线商品数的百分比）</template>
              </el-input>
            </div>
            <div class="flex mt10">
              <el-radio label="1">个数</el-radio>
              <el-input v-model="form.priceRiseNumber" style="width: 350px" placeholder="请输入">
                <template slot="append">个以内</template>
              </el-input>
            </div>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="涨价周期" prop="priceRisePeriod">
          <el-input v-model="form.priceRisePeriod" style="width: 400px" placeholder="请输入">
            <template slot="append">天以内不允许二次降价</template>
          </el-input>
        </el-form-item>
        <el-form-item label="涨价预期" prop="priceRiseExpect">
          <el-radio-group v-model="form.priceRiseExpectType" @change="changeExpect">
            <el-radio v-for="(item,index) in expectList" :key="index" :label=" ''+ index" class="flex mb10">
              <el-input @input="inputExpect(index)" v-model="item['value'+index]" size="small"
                        placeholder="请输入" class="mr5 width3">
                <template slot="prepend">{{ item.label1 }}</template>
                <template slot="append">{{ item.label2 }}</template>
              </el-input>
              <el-input v-if="item.label3" @input="inputExpect(index)" v-model="item['day'+index]" size="small"
                        placeholder="请输入" class="width2">
                <template slot="prepend">{{ item.label3 }}</template>
                <template slot="append">{{ item.label4 }}</template>
              </el-input>
              <el-input v-if="item.label5" @input="inputExpect(index)" v-model="item['num'+index]" size="small"
                        placeholder="请输入" class="width3 ml5">
                <template slot="prepend">{{ item.label5 }}</template>
                <template slot="append">{{ item.label6 }}</template>
              </el-input>
            </el-radio>

            <!--            <el-radio label="0" class="flex mb5">-->
            <!--              <el-input v-model="form.memo" style="width: 300px" placeholder="请输入">-->
            <!--                <template slot="prepend">亏损不超过</template>-->
            <!--                <template slot="append">%</template>-->
            <!--              </el-input>-->
            <!--            </el-radio>-->
            <!--            <el-radio label="1" class="flex mb5">-->
            <!--              <el-input v-model="form.memo" style="width: 300px" placeholder="请输入">-->
            <!--                <template slot="prepend">亏损不超过</template>-->
            <!--                <template slot="append">元人民币</template>-->
            <!--              </el-input>-->
            <!--            </el-radio>-->
            <!--            <el-radio label="2" class="flex mb5">-->
            <!--              <el-input v-model="form.memo" style="width: 300px" placeholder="请输入">-->
            <!--                <template slot="prepend">盈利不低于</template>-->
            <!--                <template slot="append">%</template>-->
            <!--              </el-input>-->
            <!--            </el-radio>-->
            <!--            <el-radio label="3" class="flex">-->
            <!--              <el-input v-model="form.memo" style="width: 300px" placeholder="请输入">-->
            <!--                <template slot="prepend">盈利不低于</template>-->
            <!--                <template slot="append">元人民币</template>-->
            <!--              </el-input>-->
            <!--            </el-radio>-->
            <!--            <el-radio label="4" class="flex mb5 mt5">-->
            <!--              <el-input v-model="form.memo" style="width: 280px" placeholder="请输入">-->
            <!--                <template slot="prepend">亏损不超过</template>-->
            <!--                <template slot="append">元人民币</template>-->
            <!--              </el-input>-->
            <!--              <el-input class="ml10 mr10" v-model="form.memo" style="width: 180px" placeholder="请输入">-->
            <!--                <template slot="prepend">近</template>-->
            <!--                <template slot="append">天</template>-->
            <!--              </el-input>-->
            <!--              <el-input v-model="form.memo" style="width: 220px" placeholder="请输入">-->
            <!--                <template slot="prepend">出单</template>-->
            <!--                <template slot="append">单以上</template>-->
            <!--              </el-input>-->
            <!--            </el-radio>-->
            <!--            <el-radio label="5" class="flex">-->
            <!--              <el-input v-model="form.priceRiseExpect" style="width: 280px" placeholder="请输入">-->
            <!--                <template slot="prepend">盈利不低于</template>-->
            <!--                <template slot="append">元人民币</template>-->
            <!--              </el-input>-->
            <!--              <el-input class="ml10 mr10" v-model="form.priceRiseExpectDay" style="width: 180px" placeholder="请输入">-->
            <!--                <template slot="prepend">近</template>-->
            <!--                <template slot="append">天</template>-->
            <!--              </el-input>-->
            <!--              <el-input v-model="form.priceRiseExpectOrderNumber" style="width: 220px" placeholder="请输入">-->
            <!--                <template slot="prepend">出单</template>-->
            <!--                <template slot="append">单以上</template>-->
            <!--              </el-input>-->
            <!--            </el-radio>-->
          </el-radio-group>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {addProject, editProject, queryProjectById} from "@/api/autoOperation/risePrice";
import {getSellerStoreEmpower} from "@/api/seller/sellerStoreEmpower";

export default {
  name: "risePrice",
  props: {
    storeId: {},
    configId: {
      type: String,
      default: ""
    },
    isUseShareCode: { // 是否使用分享码
      type: String,
      default: "0"
    }
  },
  data() {
    return {
      buttonLoading: false,//确定提交表单按钮loading
      title: "新增涨价配置",
      open: true,
      form: {},
      rules: {
        projectName: [{required: true, message: "涨价名称不能为空", trigger: "blur"}],
        termFristAverageLoss: [{required: true, message: "首要条件不能为空", trigger: "blur"}],
        termOneLossPrice: [
          {required: true, message: "涨价条件1不能为空", trigger: "blur"},
          {validator: this.$Validate.isPositiveInteger},
          {validator: this.checkRisePrice1}],
        termTwoOrderNumber: [
          {required: true, message: "涨价条件2不能为空", trigger: "blur"},
          {validator: this.checkRisePrice2}, {validator: this.$Validate.isPositiveInteger}],
        termThreeOrderNumber: [
          {required: true, message: "涨价条件3不能为空", trigger: "blur"},
          {validator: this.checkRisePrice3}, {validator: this.$Validate.isPositiveInteger}],
        priceRiseNumber: [{required: true, trigger: "blur", validator: this.checkRisePriceNum}],
        priceRisePeriod: [{required: true, message: "涨价周期不能为空", trigger: "blur"},
          {validator: this.$Validate.isPositiveInteger}],
        priceRiseExpectType: [{required: true, message: "涨价预期类型不能为空", trigger: "change"}],
        priceRiseExpect: [{required: true, message: "涨价预期不能为空", trigger: "blur"},
          {validator: this.checkRiseExpect}],
      },
      percentage: "",// 涨价数量百分比
      expectList: [
        {label1: "亏损不超过", label2: "%", value0: ""},
        {label1: "亏损不超过", label2: "元人民币", value1: ""},
        {label1: "盈利不低于", label2: "%", value2: ""},
        {label1: "盈利不低于", label2: "元人民币", value3: ""},
        {
          label1: "亏损不超过",
          label2: "元人民币",
          label3: "近",
          label4: "天",
          label5: "出单",
          label6: "单以上",
          value4: "",
          day4: "",
          num4: "",
        },
        {
          label1: "盈利不低于",
          label2: "元人民币",
          label3: "近",
          label4: "天",
          label5: "出单",
          label6: "单以上",
          value5: "",
          day5: "",
          num5: "",
        },
      ]
    }
  },
  created() {
    if (this.configId) {
      this.getConfigDetail()
    } else {
      this.reset()
    }
  },
  methods: {
    // 修改涨价预期
    changeExpect(e) {
      this.form.priceRiseExpect = this.expectList[e]['value' + e]
      if (e == '4' || e == '5') {
        this.form.priceRiseExpectDay = this.expectList[e]['day' + e]
        this.form.priceRiseExpectOrderNumber = this.expectList[e]['num' + e]
      }
    },
    // 输入降价预期
    inputExpect(e) {
      let index = this.form.priceRiseExpectType
      this.form.priceRiseExpect = this.expectList[index]['value' + index]
      this.form.priceRiseExpectDay = this.expectList[index]['day' + index]
      this.form.priceRiseExpectOrderNumber = this.expectList[index]['num' + index]
    },
    // 获取降价配置详情
    getConfigDetail() {
      this.title = "修改涨价配置"
      queryProjectById({id: this.configId}).then(res => {
        let data = res.data
        for (let key in data) { //将所有字符转成字符串
          if (data[key] != null) {
            data[key] = '' + data[key]
          }
        }
        this.form = data
        if (data.priceRiseType == '0') {
          this.percentage = data.priceRiseNumber
          this.form.priceRiseNumber = ""
        } else {
          this.percentage = ""
          this.form.priceRiseNumber = data.priceRiseNumber
        }
        this.expectList[this.form.priceRiseExpectType]['value' + this.form.priceRiseExpectType] = this.form.priceRiseExpect
        if (this.form.priceRiseExpectDay) {
          this.expectList[this.form.priceRiseExpectType]['day' + this.form.priceRiseExpectType] = this.form.priceRiseExpectDay
        }
        if (this.form.priceRiseExpectOrderNumber) {
          this.expectList[this.form.priceRiseExpectType]['num' + this.form.priceRiseExpectType] = this.form.priceRiseExpectOrderNumber
        }
      })
    },
    // 确定提交
    submitForm() {
      this.$refs['form'].validate(valid => {
        if (valid) {
          this.$confirm('是否确定提交涨价计划？').then(() => {
            if (this.isUseShareCode == '1') {
              this.form.id = undefined;
              this.form.storeId = this.storeId
              this.form.userId = this.userId
              this.form.storeUserName = this.storeUserName
            }
            this.form.priceRiseNumber = this.form.priceRiseType == '0' ? this.percentage : this.form.priceRiseNumber
            if (this.form.id) {
              editProject(this.form).then(res => {
                this.$message.success(res.msg)
                this.cancel()
              })
            } else {
              addProject(this.form).then(res => {
                this.$message.success(res.msg)
                this.cancel()
              })
            }
          })
        }
      })
    },
    // 重置
    reset() {
      this.form = {
        id: undefined,
        projectName: undefined,
        priceRiseType: '0',
        termFristAverageLoss: undefined,
        termOneLossPrice: undefined,
        termOneAdjustmentLossPrice: undefined,
        termTwoOrderNumber: undefined,
        termTwoAdjustmentDiscount: undefined,
        termThreeOrderNumber: undefined,
        termThreeAdjustmentDiscount: undefined,
        priceRiseNumber: undefined,
        priceRisePeriod: undefined,
        priceRiseExpectType: '0',
        priceRiseExpect: undefined,
        priceRiseExpectDay: undefined,
        priceRiseExpectOrderNumber: undefined,
        storeId: this.storeId,
        userId: undefined,
        storeUserName: this.storeUserName,
      }
      this.resetForm("form");
    },
    // 校验涨价预期
    checkRiseExpect(rule, value, callback) {
      let index = this.form.priceRiseExpectType;
      if (index == '4' || index == '5') {
        let value2 = this.form.priceRiseExpectDay;
        let value3 = this.form.priceRiseExpectOrderNumber;
        if (!value2 || !value3) {
          callback(new Error('涨价预期不能为空！'))
        } else {
          this.$Validate.isPositiveInteger(rule, value2, callback)
          this.$Validate.isPositiveInteger(rule, value3, callback)
        }
      } else {
        this.$Validate.isPositiveInteger(rule, value, callback)
      }

    },
    // 校验涨价数量
    checkRisePriceNum(rule, value, callback) {
      let value2 = this.percentage
      if (this.form.priceRiseType == '0') {
        if (!value2) {
          callback(new Error("张价数量百分比不能为空！"));
        } else {
          this.$Validate.isPositiveInteger(rule, value2, callback)
        }
      } else {
        if (!value) {
          callback(new Error("涨价数量个数不能为空！"));
        } else {
          this.$Validate.isPositiveInteger(rule, value, callback)
        }
      }

    },
    // 涨价条件一校验
    checkRisePrice1(rule, value, callback) {
      let value2 = this.form.termOneAdjustmentLossPrice
      if (!value2) {
        callback(new Error("涨价条件1不能为空！"));
      } else {
        this.$Validate.isPositiveInteger(rule, value2, callback)
      }
    },
    // 涨价条件2校验
    checkRisePrice2(rule, value, callback) {
      let value2 = this.form.termTwoAdjustmentDiscount
      if (!value2) {
        callback(new Error("涨价条件2不能为空！"));
      } else {
        this.$Validate.isPositiveInteger(rule, value2, callback)
      }
    },
    // 涨价条件3校验
    checkRisePrice3(rule, value, callback) {
      let value3 = this.form.termThreeAdjustmentDiscount
      if (!value3) {
        callback(new Error("涨价条件3不能为空！"));
      } else {
        this.$Validate.isPositiveInteger(rule, value3, callback)
      }
    },
    // 取消
    cancel() {
      this.$emit('close', false)
    },
  }
}
</script>

<style scoped>

</style>
